/*
 * @Author: Zhang Kai
 * @Date: 2021-10-22 12:06:34
 * @LastEditors: mayijun
 * @LastEditTime: 2022-07-14 11:04:28
 * @FilePath: /metricsx-standard-ui/src/components/customicon/custom-icon.tsx
 */
import { defineComponent, PropType } from 'vue';
import './icon.scss';
import '@/assets/icons/iconfont';

const CustomIconFontSVG = defineComponent({
  name: 'CustomIconFont',
  props: {
    name: {
      type: String as PropType<string>
    },
    color: {
      type: String as PropType<string>
    }
  },
  emits: ['click'],
  setup: (props, { slots, attrs, emit }) => {
    return () => {
      const { name, color } = props;
      return (
        <svg
          class="custom-icon icon"
          aria-hidden="true"
          onClick={(e: any) => emit('click', e)}
          color={color}
        >
          <use xlinkHref={`#${name}`}></use>
        </svg>
      );
    };
  }
});

export default CustomIconFontSVG;
